<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:include="include/head::commonHeaderList('CaseShareManage')">
    <!--<body oncontextmenu="self.event.returnValue=false" onselectstart="return false">-->
<!--<link rel="stylesheet"  th:href="@{/static/css/}" />-->
<body>
<div id="content" class="col-lg-12 col-sm-12">
    <div class="row">
        <div class="box col-md-12">
            <div class="box-inner">
                <div class="box-header well" data-original-title="">
                    <h2>
                        <i class="glyphicon glyphicon-user"></i> CaseShareManage
                    </h2>
                    <div class="box-icon">
                        <!-- <a href="#" class="btn btn-setting btn-round btn-default"><i class="glyphicon glyphicon-cog"></i></a> -->
                        <a href="javascript:void(0);" id="smaller" class="btn btn-minimize btn-round btn-default"><i class="glyphicon glyphicon-chevron-up"></i></a>
                        <!-- <a href="#"	class="btn btn-close btn-round btn-default"><i class="glyphicon glyphicon-remove"></i></a> -->
                    </div>
                </div>
                <div class="box-content">
                    <form class="form-inline" style="margin-bottom:0.5%" id="searchForm" role="form" method="post"
                          th:action="${#request.getRequestURI()}">
                            <div class="form-group ">
                                <select name="pageSize"  class="form-control input-sm" >
                                    <option value="10" th:selected="${pageSize==10}">10条/页</option>
                                    <option value="25" th:selected="${pageSize==25}">25条/页</option>
                                    <option value="50" th:selected="${pageSize==50}">50条/页</option>
                                </select>
                            </div>

                        <div class="form-group">
                            <select name="sourceTypeId" id="sourceTypeId" class="input-sm">
                                <option value="">--选择分类--</option>
                                <!--/*@thymesVar id="teacher" type="java"*/-->
                                <option th:selected="${sourceTypeId == list.id}" th:each="list:${csTypeList}"
                                        th:value="${list.id}" th:text="${list.typeName}"></option>
                            </select>
                            <select name="sex" id="sex" class="input-sm">
                                <option value="">--选择性别--</option>
                                <option value="1" th:selected="${sex==1}">男</option>
                                <option value="2" th:selected="${sex==2}">女</option>
                            </select>
                            <select name="gradeId" id="gradeId" class="input-sm">
                                <option value="">--选择年级--</option>
                                <!--/*@thymesVar id="teacher" type="java"*/-->
                                <option th:selected="${gradeId == list.id}" th:each="list:${QGradeList}"
                                        th:value="${list.id}" th:text="${list.cnName}"></option>
                            </select>
                            <select class="input-sm" th:name="state">
                                <option value="">--审核状态--</option>
                                <option value="1" th:selected="${state == 1}">待审核</option>
                                <option value="2" th:selected="${state == 2}">已通过</option>
                                <option value="3" th:selected="${state == 3}">未通过</option>
                            </select>
                            <div class="dropdown" style="display:inline;" id="storeOpen">
                                <button class="form-control  btn-default dropdown-toggle input-sm" type="button" id="dropdownMenu2" data-toggle="dropdown"style="padding:0px 12px;font-size:12px;">
                                    --请选择标签--<span class="caret"></span></button>
                                 <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu"  style="width:auto;height:auto;max-height:400px;overflow-y:hidden">
                                     <li role="presentation"style="padding-left:10px;white-space: nowrap;padding-right:10px;height:20px;">
                                         <div class="checkbox"style="padding-top:0px;padding-bottom:10px;">
                                            <label>
                                                <input type="checkbox" id="selectAllLabels">全选
                                            </label>
                                        </div>
                                    </li>
                                    <li role="presentation" style="padding-left:10px;white-space: nowrap;padding-right:10px;height:20px;" th:each="labelsList:${labelsList}">
                                        <div class="checkbox" style="padding-top:0px;padding-bottom:10px;">
                                            <label>
                                                <input type="checkbox" name="LabelIds" th:value="${labelsList.id}">
                                                <span th:text="${labelsList.name}"></span>
                                            </label>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                            <input placeholder="请输入标题关键词" th:value="${title}" name="title" class="form-control input-sm"/>
                        </div>
                        <div class="form-group" style="display: none">
                                <div class="input-group input-group-sm">
                                    <input type="hidden" th:value="${pageInfo.pageNum}" name="pageNum" id="pageNum">
                                </div>
                            </div>
                            <button class="btn btn-primary" type="submit"> 查 询 </button>
                            <a th:if="${session.menuMap[185] != null and session.menuMap['185'] !=''}" id ="publish"  class="btn btn-warning "><span class="glyphicon glyphicon-export"></span> 发布分享 </a>
                            <input id="publishSort" name="publishSort" th:value="${publishSort}" type="hidden">
                            <input id="pageViewsSort" name="pageViewsSort" th:value="${pageViewsSort}" type="hidden">
                            <input id="thumpupSort"  name="thumpupSort" th:value="${thumpupSort}" type="hidden">
                            <input type="hidden" th:value="${labelStr}" id="label">
                            <div id="hiddenLabel" style="display: none">
						    </div>
                    </form>
                    <table class="table table-striped table-bordered table-hover footable" data-show-toggle="false">
                        <thead>
                            <tr>
                                <th style="text-align: center;">序号</th>
                                <th style="text-align: center;" data-breakpoints="xs sm" data-title="分类">分类</th>
                                <th style="text-align: center;">标题</th>
                                <th style="text-align: center;" data-breakpoints="xs sm" data-title="学员性别">学员性别</th>
                                <th style="text-align: center;" data-breakpoints="xs sm" data-title="学员年级">学员年级</th>
                                <th style="text-align: center;" data-breakpoints="xs sm" data-title="学员年龄">学员年龄</th>
                                <th class="publishSort" style="text-align: center;" data-breakpoints="xs" data-title="发布时间">发布时间
                                    <i data-sort="1" onmouseover="down(this)" class="fa fa-caret-up fa-lg " aria-hidden="true" ></i>
                                    <i data-sort="2" onmouseover="up(this)" class="fa fa-caret-down fa-lg " aria-hidden="true"></i>
                                </th>
                                <th style="text-align: center;" data-breakpoints="xs" data-title="创建人">创建人</th>
                                <th style="text-align: center;" class="pageViewsSort" data-breakpoints="xs" data-title="浏览量">浏览量
                                    <i data-sort="1" onmouseover="down(this)" class="fa fa-caret-up fa-lg" aria-hidden="true"></i>
                                    <i data-sort="2" onmouseover="up(this)" class="fa fa-caret-down fa-lg" aria-hidden="true"></i>
                                </th>
                                <th style="text-align: center;" data-breakpoints="xs" data-title="审核状态">审核状态</th>
                                <th style="text-align: center;" class="thumupSort" data-breakpoints="xs" data-title="点赞">点赞
                                    <i data-sort="1" onmouseover="down(this)" class="fa fa-caret-up fa-lg" aria-hidden="true"></i>
                                    <i data-sort="2" onmouseover="up(this)" class="fa fa-caret-down fa-lg" aria-hidden="true"></i>
                                </th>
                                <th style="width: 200px;text-align: center;" data-breakpoints="xs sm" data-title="操作">操作</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr th:each="caseShareList,caseShareListStat: ${pageInfo.list}" >
                                <td style="text-align: center;" th:text="${caseShareListStat.index+1}">#</td>
                                <td style="text-align: center;" th:text="${caseShareList.typeName}">typeName</td>
                                <td style="text-align: left;">
                                    <div >
                                        <img th:each="reList,restat : ${caseShareList.recommendList}" style="height: 20px;width: 20px;margin-left:3px" th:src="${'http://hnres.etalk365.com/'+reList.imgUrl}">
                                        <span th:text="${caseShareList.title}"></span>
                                    </div>
                                </td>
                                <td style="text-align: center;" th:text="${caseShareList.sex==1?'男':'女'}">sex</td>
                                <td style="text-align: center;" th:text="${caseShareList.gradeName}">gradeName</td>
                                <td style="text-align: center;" th:text="${caseShareList.age}">age</td>
                                <td style="text-align: center;" th:text="${#dates.format(caseShareList.createTime, 'yyyy-MM-dd HH:mm:ss')}">createTime</td>
                                <td style="text-align: center;" th:text="${caseShareList.addUserName}">addUserName</td>
                                <td style="text-align: center;" th:text="${caseShareList.pageViews}">pageViews</td>
                                <td style="text-align: center;" th:switch="${caseShareList.state}">
                                    <span th:case="1" >待审核</span>
                                    <span th:case="2">审核通过</span>
                                    <span th:case="3" class="tips" th:attr="id=${caseShareList.id},rejectReason=${caseShareList.rejectReason}" style="cursor:pointer">不通过原因</span>
                                </td>
                                <td style="text-align: center;" th:text="${caseShareList.pointCount}">pointCount</td>
                                <td style="text-align: center;">
                                    <a th:if="${caseShareList.state==2}" th:attr="caseShareId=${caseShareList.id}" class="btn btn-success lookup" role="button"><span class="glyphicon glyphicon-pencil-sign"></span>查  看</a>
                                    <a th:if="${session.menuMap[187] != null and session.menuMap[187] !=''and caseShareList.state==1}" th:attr="caseShareId=${caseShareList.id}" style="color: #fff;background-color: #f0ad4e;border-color: #eea236;" class="btn btn-warning edite" role="button"><span class="glyphicon glyphicon-pencil-sign">审  核</span></a>
                                    <a th:if="${caseShareList.state==3 and userId == caseShareList.addUserId}" th:attr="caseShareId=${caseShareList.id}" style="color: #fff;background-color: #f0ad4e;border-color: #eea236;" class="btn btn-warning edite" role="button"><span class="glyphicon glyphicon-pencil-sign">编  辑</span></a>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                    <div th:include="include/pageinfo::pager"></div>
                </div>
            </div>
        </div>
        <!--/span-->
    </div>
    <!--/row-->
    <!-- content ends -->
</div>
<!--/#content.col-md-0-->
<div th:include="include/onload_js::onloadJSCustomList(~{::script})">
    <script>
        $(function () {
            //自适应表格
            $('.footable').footable();
            //添加排序图标
            $(".publishSort").append("<i data-sort=\"1\" onmouseover=\"down(this)\" class=\"fa fa-caret-up fa-lg\" aria-hidden=\"true\"></i><i data-sort=\"2\" onmouseover=\"up(this)\" class=\"fa fa-caret-down fa-lg\" aria-hidden=\"true\"></i>");
            $(".pageViewsSort").append("<i data-sort=\"1\" onmouseover=\"down(this)\" class=\"fa fa-caret-up fa-lg\" aria-hidden=\"true\"></i><i data-sort=\"2\" onmouseover=\"up(this)\" class=\"fa fa-caret-down fa-lg\" aria-hidden=\"true\"></i>");
            $(".thumupSort").append("<i data-sort=\"1\" onmouseover=\"down(this)\" class=\"fa fa-caret-up fa-lg\" aria-hidden=\"true\"></i><i data-sort=\"2\" onmouseover=\"up(this)\" class=\"fa fa-caret-down fa-lg\" aria-hidden=\"true\"></i>");
            //初始化排序
            if($("#publishSort").val()== 1){
                $(".publishSort i").eq(0).hide();
            }else if($("#publishSort").val()== 2){
                $(".publishSort i").eq(1).hide();
            }
            //$(".publishSort i").val("");
            if($("#pageViewsSort").val()== 1){
                $(".pageViewsSort i").eq(0).hide();
            }else if($("#pageViewsSort").val()== 2){
                $(".pageViewsSort i").eq(1).hide();
            }
            //$("#pageViewsSort").val("");
            if($("#thumpupSort").val()== 1){
                $(".thumupSort i").eq(0).hide();
            }else if($("#thumpupSort").val()== 2){
                $(".thumupSort i").eq(1).hide();
            }
            //$("#thumpupSort").val("");

            //点击排序事件
            $(".publishSort i").click(function(){
                var sort = $(this).attr("data-sort");
                //console.info(sort);
                $("#publishSort").val(sort);
                $("#pageViewsSort").val("");
                $("#thumpupSort").val("");
                //console.info("点赞排序"+$("#thumupSort").val());
                $("form").submit();
            });

            $(".pageViewsSort i").click(function(){
                var sort = $(this).attr("data-sort");
                //console.info(sort);
                $("#pageViewsSort").val(sort);
                $("#publishSort").val("");
                $("#thumpupSort").val("");
                $("form").submit();
            });

            $(".thumupSort i").click(function(){
                var sort = $(this).attr("data-sort");
                //console.info(sort);
                $("#thumpupSort").val(sort);
                $("#pageViewsSort").val("");
                $("#publishSort").val("");
                $("form").submit();
            });

            $(".tips").mouseover(function() {
                layer.tips($(this).attr("rejectReason"), $(this), {
                    tips: [1, '#0FA6D8'],
                    tipsMore: false,
                    time: 2500
                });
            });

            // var basePath = [[${#httpServletRequest.getScheme() + "://" + #httpServletRequest.getServerName() + ":" + #httpServletRequest.getServerPort() + #httpServletRequest.getContextPath()}]];
            // console.info(basePath)
            //发布页面
            $("#publish").click(function(){
                var url = "/caseShareManage/toAddCaseShare";
                layer.open({
                    type: 2,
                    title: false,
                    closeBtn: 1, //显示关闭按钮
                    shade: [0],
                    area: ['60%', '95%'],
                    //offset: 'rb', //右下角弹出
                    // time: 2000, //2秒后自动关闭
                    anim: 2,
                    content: [url, 'yes'], //iframe的url，no代表不显示滚动条
                    end: function () { //此处用于演示
                    }
                });
            });
            //初始化标签选中
            var labelDom = $('input[name="LabelIds"]');
            if(typeof ($("#label").val()) != null && typeof (labstr) != null){
                var labstr = $("#label").val().split(",");
                if(labelDom.length == labstr.length){
                    for(var i = 0; i < $('input[name="LabelIds"]').length; i++){
                        $('input[name="LabelIds"]')[i].checked = true;
                    }
                    $("#dropdownMenu2").text($(labelDom).eq(0).next().text());
                    $("#selectAllLabels")[0].checked = true;
                }else{
                     $("#selectAllLabels")[0].checked = false;
                }
                 for(var i = 0;i<labstr.length;i++){
                    for(var j = 0;j<labelDom.length;j++){
                        if(labstr[i] == $(labelDom[j]).val()){
                            $(labelDom[j])[0].checked = true;
                             if(i==0){
                                $("#dropdownMenu2").text($(labelDom[j]).next().text());
                             }
                        }
                    }
                }
                $('#hiddenLabel').html("<input type='hidden' name='labelStr' value='"+$("#label").val()+"'/>");
            }

            $("#smaller").click(function () {
                var box = $(this).parent().parent().next(".box-content");
                //$(box).toggle('fast');
                if($(box).css('display')=='none'){
                    $("#smaller").html("<i class=\"glyphicon glyphicon-chevron-up\"></i>");
                    $(box).show('fast');
                }else{
                    $("#smaller").html("<i class=\"glyphicon glyphicon-chevron-down\"></i>");
                    $(box).hide('fast');
                }
            });


        //编辑按钮
        $(".edite").click(function(){
            var url = "/caseShareManage/editeCaseShare?caseShareId="+$(this).attr("caseShareId");
            layer.open({
                type: 2,
                title: false,
                closeBtn: 1, //显示关闭按钮
                shade: [0],
                area: ['60%', '95%'],
                //offset: 'rb', //右下角弹出
                // time: 2000, //2秒后自动关闭
                anim: 2,
                content: [url, 'yes'], //iframe的url，no代表不显示滚动条
                end: function () { //此处用于演示
                }
            });
        });

        //查看按钮
        $(".lookup").click(function(){
            var url = "/caseShareManage/showCaseShare?caseShareId="+$(this).attr("caseShareId");
            layer.open({
                type: 2,
                title: false,
                closeBtn: 1, //显示关闭按钮
                shade: [0],
                area: ['60%', '95%'],
                //offset: 'rb', //右下角弹出
                // time: 2000, //2秒后自动关闭
                anim: 2,
                content: [url, 'yes'], //iframe的url，no代表不显示滚动条
                end: function () {
                    //location.reload();
               }
             });
        });
     });
        $('input[name="LabelIds"]').click(function () {
            var dom = $('input[name="LabelIds"]:checked');
            if (dom.length > 0) {
                $("#dropdownMenu2").text($(dom).eq(0).next().text());
            } else {
                $("#dropdownMenu2").text("--请选择标签--");
            }
            //反选标签
            if (dom.length == $('input[name="LabelIds"]').length) {
                $("#selectAllLabels")[0].checked = true;
            } else {
                $("#selectAllLabels")[0].checked = false;
            }
            var labelStr = "";
            for(var i=0;i<dom.length;i++){
                if(i==dom.length-1 || dom.length==1){
                    labelStr+=$(dom[i]).attr("value");
                }else{
                     labelStr+=$(dom[i]).attr("value")+",";
                }
            }
            //console.info(labelStr);
            $('#hiddenLabel').html("<input type='hidden' name='labelStr' value='"+labelStr+"'/>");
        });

        //标签全选
        $("#selectAllLabels").click(function () {
            if ($(this)[0].checked) {
                for(var i = 0; i < $('input[name="LabelIds"]').length; i++){
                    $('input[name="LabelIds"]')[i].checked = true;
                }
            } else {
                for(var i = 0; i < $('input[name="LabelIds"]').length; i++){
                    $('input[name="LabelIds"]')[i].checked = false;
                }
            }
            var labelStr = "";
            var dom = $('input[name="LabelIds"]:checked');
            for(var i=0;i<dom.length;i++){
                if(i==dom.length-1 || dom.length==1){
                    labelStr+=$(dom[i]).attr("value");
                }else{
                     labelStr+=$(dom[i]).attr("value")+",";
                }
            }
            //console.info(labelStr);
            $('#hiddenLabel').html("<input type='hidden' name='labelStr' value='"+labelStr+"'/>");
        });

        //鼠标经过事件  顺序
        function  down(obj){
            $(obj).css("cursor","Pointer");
            $(obj).attr("title","顺序排列")
        }
        //鼠标经过事件  倒序
        function up(obj){
            $(obj).css("cursor","Pointer");
            $(obj).attr("title","倒序排列")
        }

        function over(obj,id){
            layer.tips(obj, '#'+id, {
              tips: [4, '#78BA32']
            });
        }
    </script>
</div>
</body>
</html>
